import './Scss/TextList.scss'
import dayjs from 'dayjs'

export const TextList001 = ({ Top, data, click }) => {
    return (
        <div className="TextList001">
            <div className="Top">
                {Top.map(({ uuid, label, flex }) => (
                    <div key={uuid} style={{ flex }}>
                        {label}
                    </div>
                ))}
            </div>
            <div className="List">
                {data.map((item, index) => (
                    <div
                        key={index}
                        style={{ cursor: click ? 'pointer' : 'auto' }}
                        onClick={() => {
                            if (click) click.emit(item)
                        }}
                    >
                        {Top.map(({ uuid, value, unit, flex, time }) => (
                            <div key={uuid} style={{ flex }}>
                                {time ? dayjs(item[value]).format('YYYY-MM-DD') : item[value]} {unit}
                            </div>
                        ))}
                    </div>
                ))}
            </div>
        </div>
    )
}
